<template>
	<switch class="QS-Switch" ref="QS-Switch" :checked="val" @change="change" :color="getColor" :disabled="disabled" />
</template>

<script>
	import QSComponentMixin from '../../mixins/QS-Components-Mixin.js';
	import QSFormElMixin from '../../js/QS-Form/mixins/QS-Form-El-Mixin.js';
	let props;
	try{
		props = require('@/QS-UI-CONFIG/components/QS-Switch/js/props.js');
	}catch(e){
		//TODO handle the exception
		props = {};
	}
	const componentType = 'QS-Switch';
	const QSComponentMixinRes = QSComponentMixin({ 
		componentType,
		nodeName: '.QS-Switch'
	});
	const QSFormElMixinRes = QSFormElMixin({ componentType });

	export default {
		mixins: [
			QSComponentMixinRes.mixin,
			QSFormElMixinRes.mixin,
		],
		props: {
			// #ifdef MP-ALIPAY
			...QSComponentMixinRes.props,
			// #endif
			color: {
				type: String,
				default: ''
			},
			...props,
			// #ifdef MP-ALIPAY
			...QSFormElMixinRes.props,
			// #endif
		},
		mounted() {
			console.log(this.value)
		},
		computed: {
			getColor() {
				return this.color || this.themes[this.theme || 'primary'];
			}
		}
	};
</script>

<style scoped>
	
</style>
